var scene = new THREE.Scene();

//立方体
const lft = function () {
  var geometry = new THREE.BoxGeometry(200, 200, 100); //立方体 长高宽
  var material = new THREE.MeshLambertMaterial({
    color: 0xff0000, //颜色16进制
    opacity: 0.6,
    // wireframe:true,
    transparent: true,
  });
  // material.opacity=0.9
  var mesh = new THREE.Mesh(geometry, material);
  scene.add(mesh);

  //点模型
  const dmx = () => {
    var material = new THREE.PointsMaterial({
      color: 0x0000ff,
      size: 10, //点对象像素尺寸
    });
    var points = new THREE.Points(geometry, material);
    scene.add(points);
  };
  //线模型
  const xmx = () => {
    var material = new THREE.LineBasicMaterial({
      color: 0x0000fff, //线条颜色
    });
    var line = new THREE.Line(geometry, material);
    scene.add(line);
  };

  dmx();
  xmx();

  //顶点颜色
  const ddcolor = () => {
    var geometry = new THREE.BufferGeometry(); //空几何体对象
    var vertices = new Float32Array([
      0,
      0,
      0, //顶点1坐标
      50,
      0,
      0, //顶点2坐标
    ]);
    var attribue = new THREE.BufferAttribute(vertices, 3); //属性缓冲区对象
    geometry.attributes.position = attribue;
    var colors = new Float32Array([
      1,
      0,
      0, //顶点1颜色
      0,
      0,
      0, //顶点2颜色
    ]);
    geometry.attributes.color = new THREE.BufferAttribute(colors, 3);
    var material = new THREE.PointsMaterial({
      vertexColors: THREE.VertexColors,
      size: 10,
    });
    var points = new THREE.Points(geometry, material);
    scene.add(points);
  };
  ddcolor();
};

//球体
const qt = function (y = 150) {
  var geometry = new THREE.SphereGeometry(60, 40, 40);
  // var material = new THREE.MeshLambertMaterial({
  //   color: 0x0000ff,
  // });
  var material = new THREE.MeshPhongMaterial({
    color: 0x0000ff,
    specular: 0x4488ee,
    shininess: 12,
  });
  var mesh = new THREE.Mesh(geometry, material); //网格模型对象Mesh
  mesh.translateY(y); //球体网格模型沿Y轴正方向平移120
  scene.add(mesh);
};

//自定义
const zdy = function () {
  var geometry = new THREE.BufferGeometry();
  var vertices = new Float32Array([
    0,
    0,
    0, //顶点1坐标
    50,
    0,
    0, //顶点2坐标
    0,
    100,
    0, //顶点3坐标
    0,
    0,
    0, //顶点4坐标
    0,
    0,
    100, //顶点5坐标
    50,
    0,
    0, //顶点6坐标
  ]);
  var attribue = new THREE.BufferAttribute(vertices, 3);
  geometry.attributes.position = attribue;
  var material = new THREE.MeshBasicMaterial({
    color: 0x0000ff, //三角面颜色
    side: THREE.DoubleSide, //两面可见
  });
  var mesh = new THREE.Mesh(geometry, material);
  mesh.translateX(200);
  scene.add(mesh);
};

lft();
qt();
qt(-150);
zdy();

//点光源
var point = new THREE.PointLight(0xdddddd); //光源
point.position.set(400, 300, 300); //光位置
// point.position.set(0, 0, 0);
scene.add(point);

//环境光
var ambient = new THREE.AmbientLight(0xffffff);

var width = window.innerWidth;
var height = window.innerHeight;
var k = width / height;
var s = 200; //物体远近
var camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000); //相机对象
camera.position.set(100, 300, 200); //相机位置
camera.lookAt(scene.position);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(width, height);
renderer.setClearColor(0x00ff00, 1);
document.body.appendChild(renderer.domElement);
render();

var controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.addEventListener('change', render);
//三维坐标系
var axisHelper = new THREE.AxisHelper(250);
scene.add(axisHelper);

function render() {
  renderer.render(scene, camera); //执行渲染操作
  // mesh.rotateX(0.01);
  // requestAnimationFrame(render)
}
